<!DOCTYPE HTML>
<html>

<head>
    <meta charset="utf-8"/>
    <title><%= config.name %></title>
    <!-- 新 Bootstrap 核心 CSS 文件 -->
    <link rel="stylesheet" href="/public/libs/bootstrap/css/bootstrap.min.css">

    <!-- 可选的Bootstrap主题文件（一般不用引入） -->
    <link rel="stylesheet" href="/public/libs/bootstrap/css/bootstrap-theme.min.css">

    <link rel="stylesheet" href="/public/stylesheets/animate.min.css"/>

    <link href="/public/javascripts/viewer/viewer.css" rel="stylesheet">

    <link href="/public/javascripts/webuploader/webuploader.css" rel="stylesheet">

    <link rel="stylesheet/less" type="text/css" href="/public/stylesheets/styles-bootcss.less">

    <script src="/public/javascripts/less.min.js"></script>

    <!-- jQuery文件。务必在bootstrap.min.js 之前引入 -->
    <script src="/public/javascripts/jquery.min.js"></script>

    <!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
    <script src="/public/libs/bootstrap/js/bootstrap.min.js"></script>

    <script src="/public/javascripts/viewer/viewer.js"></script>

</head>

<body>
<!-- Fixed navbar -->
<nav class="navbar navbar-default navbar-fixed-top">
    <div class="container shufa-nav">
        <a class="navbar-brand" href="/"><strong><%= config.name %></strong></a>

        <div id="navbar" class="navbar-collapse collapse">
            <ul class="nav navbar-nav">
                <li><a href="#">发现</a></li>
                <li><a href="#about">关于</a></li>
            </ul>
            <%if(typeof(currentUser) !== 'undefined' && currentUser){%>
            <div class="pull-right nav-container-right">
                <img class="img-user" src="<%= currentUser.avatar %>">
            </div>
            <%}else{%>
            <div class="pull-right shufa-btn-login">
                <a href="/signin">登录</a>
            </div>
            <%}%>
        </div>
    </div>
</nav>
<div class="container">
    <%if(typeof(currentUser) !== 'undefined' && currentUser){%>
    <div class="user-dialog pull-right hide">
        <div class="user-panel">
            <div class="triangle"></div>
            <div class="body">
                <div class="user-info">
                    <div class="profile"><img src="<%= currentUser.avatar %>"></div>
                    <p><span><%= currentUser.name %></span></p>

                    <p><span><%= currentUser.email %></span></p>
                </div>
                <hr/>
                <ul>
                    <li><a>我的作品</a></li>
                    <li><a href="/profile">账号设置</a></li>
                    <li><a>帮助中心</a></li>
                    <li><a href="/signout">退出登录</a></li>
                </ul>
            </div>
        </div>
    </div>
    <%}%>

    <div class="con-container">


        <form action='/topic/create' method='post'>
            <div class="edit-panel">
                <div id="txtContent" class="input-adaptive" contenteditable="plaintext-only"
                     placeholder="一些文字..."></div>
                <div id="uploader">
                    <div class="queueList">
                        <ul class="filelist">
                            <li>
                                <div class="btn-plus"><img src="/public/images/plus.png"></div>
                            </li>
                        </ul>
                        <div class="btns hide">
                            <div id="filePicker2"></div>
                            <div class="uploadBtn">开始上传</div>
                        </div>
                    </div>
                </div>
                <div class="tags clearfix">
                    <ul>
                        <% tabs.forEach(function (pair) {
                        var value = pair[0];
                        var text = pair[1]; %>
                        <li value="<%= value %>"><%= text %></li>
                        <% }) %>
                    </ul>
                </div>
                <input type="hidden" name="t_content" id="topicText">
                <input type="hidden" name="tab" id="topicTag">
                <input type="hidden" name="img" id="topicImg">

                <div class="buttons">
                    <button id="btn-publish" type="submit" class="publish">发布</button>
                </div>
            </div>
        </form>
    </div>
</div>
<!--引入JS-->
<script type="text/javascript" src="/public/javascripts/webuploader/webuploader.js"></script>
<script type="text/javascript" src="/public/javascripts/uploader.js"></script>
<script type="text/javascript">
    $(document).ready(function () {
        $('.tags>ul>li').click(function () {
            $('.tags>ul>li').removeClass('active');
            $(this).addClass('active');
            $('#topicTag').val($(this).attr('value'));
        });
        $('.img-user').click(function () {
            $('.user-dialog').toggleClass('hide');
        })
        $('#btn-publish').click(function () {
            var text = $('#txtContent').html();

            $('#topicText').val(text);
            var tag = $('#topicTag').val();
            var img = []
            $('.filelist>li').each(function () {
                var url = $(this).attr('data-url');
                if (url) {
                    var width = $(this).attr('data-width');
                    var height = $(this).attr('data-height');
                    img.push({url: url, width: width, height: height});
                }
            })
            $('#topicImg').val(JSON.stringify(img));

            if (!text | !tag | !img)
                return false;
        });
    });
</script>

<div style="display:none;">
    <script>
        var _hmt = _hmt || [];
        (function() {
            var hm = document.createElement("script");
            hm.src = "https://hm.baidu.com/hm.js?c6cc56a5c39125422b6c9cc0607294b5";
            var s = document.getElementsByTagName("script")[0];
            s.parentNode.insertBefore(hm, s);
        })();
    </script>
</div>
</body>

</html>